<template>
  <view>
    <u-popup
      :show="upopupshowmiashi"
      mode="center"
      :round="10"
      closeOnClickOverlay
      @close="closeupopupshowmiashi"
    >
      <view class="upopupshowmiashicss">
        <view class="upopupshcsstop">
          {{ popTitle ? "修改面试" : "邀请面试" }}
        </view>
        <view>
          <!-- -->
          <view class="upopupshowmiashicsstextnr">
            <view class="nrtextop">面试方式：</view>
            <view class="nrtexnr" @click="show = true">
              <u--input
                placeholder="请选择"
                border="surround"
                disabled
                class="inputext"
                style="pointer-events: none"
                :value="columnstext(objlist.InterviewType)"
              >
              </u--input>
            </view>
          </view>

          <view class="upopupshowmiashicsstextnr" @click="datashow">
            <view class="nrtextop">
              <text>面试日期：</text>
            </view>
            <view class="nrtexnr">
              <u--input
                placeholder="请选择"
                border="surround"
                disabled
                class="inputext"
                style="pointer-events: none"
                v-model="datatext"
              >
              </u--input>
            </view>
          </view>

          <view class="upopupshowmiashicsstextnr" @click="timesmetshow">
            <view class="nrtextop">
              <text>面试时间：</text>
            </view>
            <view class="nrtexnr">
              <u--input
                placeholder="请选择"
                border="surround"
                disabled
                class="inputext"
                style="pointer-events: none"
                v-model="timetext"
              >
              </u--input>
            </view>
          </view>

          <view
            class="upopupshowmiashicsstextnr"
            v-if="objlist.InterviewType == 0"
          >
            <view class="nrtextop">
              <text>详细地址：</text>
            </view>
            <view class="nrtexnr addcss">
              <view @click="addxuanzhe" style="width: 90%; padding: 0rpx 20rpx">
                <text
                  v-show="!objlist.Address"
                  style="color: rgb(192, 196, 204)"
                >
                  请选择
                </text>
                <text v-show="objlist.Address">
                  {{ objlist.Address }}
                </text>
              </view>

              <view @click="xxAddress">
                <u-icon name="map"></u-icon>
              </view>
            </view>
          </view>

          <view class="upopupshowmiashicsstextnr">
            <view class="nrtextop">
              <text>联系人：</text>
            </view>
            <view class="nrtexnr">
              <u--input
                placeholder="请输入联系人"
                border="surround"
                v-model="objlist.LinkManName"
                @focus="close"
                class="inputext"
              >
              </u--input>
            </view>
          </view>
          <view class="upopupshowmiashicsstextnr">
            <view class="nrtextop">
              <text>联系电话：</text>
            </view>
            <view class="nrtexnr">
              <u--input
                placeholder="请输入联系方式"
                border="surround"
                v-model="objlist.LinkManPhone"
                @focus="close"
                type="number"
                class="inputext"
              >
              </u--input>
            </view>
          </view>
        </view>

        <view class="ofbutbutton">
          <text class="upopupnrbut2" @click="clickbut">确定</text>
        </view>
      </view>
    </u-popup>

    <!-- 日期 -->
    <u-datetime-picker
      :show="datetimeshow"
      v-model="value1"
      mode="date"
      @confirm="datetimeconfirm"
      :minDate="value1"
      :maxDate="value1 + 1000000000"
      closeOnClickOverlay
      @cancel="close"
    ></u-datetime-picker>
    <!-- 时间 -->
    <u-picker
      :show="timmeteshow"
      ref="uPicker"
      closeOnClickOverlay
      @cancel="close"
      :columns="columnstime"
      :defaultIndex="defaultIndex"
      @confirm="confirmtimme"
    ></u-picker>
    <!-- 状态 -->
    <u-picker
      :show="show"
      :columns="columns"
      keyName="name"
      closeOnClickOverlay
      @cancel="close"
      @confirm="confirmzt"
    >
    </u-picker>

    <!-- 地址 -->
    <u-picker
      :show="addshow"
      :columns="addcolumns"
      keyName="Address"
      closeOnClickOverlay
      @cancel="close"
      @confirm="addconfirm"
    >
    </u-picker>
  </view>
</template>

<script>
import area from "@/pages/component/area.js";
export default {
  props: {
    upopupshowmiashi: {
      type: Boolean,
      default: false,
    },
    Longitude: {
      type: Number,
    },
    Latitude: {
      type: Number,
    },
    objlist: {
      type: Object,
    },
    popTitle: {
      type: Boolean,
      default: false,
    },
  },
  //子组件
  components: {},
  data() {
    return {
      objlist: {
        InterviewType: "0", //面试方式
        InterviewTime: "", //面试时间
        // ProvinceCode: "", //省
        // CityCode: "", //市
        // AreaCode: "", //区
        PcaAddress: "",
        LinkManName: "", //联系人名称
        LinkManPhone: "", //联系人电话
        Address: "", //面试地址
        Longitude: "", //面试地点 经度
        Latitude: "", //面试地点 纬度
      },
      value1: Number(new Date()),
      timmeteshow: false,
      datetimeshow: false,
      show: false,
      // 0.线下面试 1.语音面试 2.视频面试
      columns: [
        [
          {
            id: "0",
            name: "线下面试",
          },
          //  {
          // 	id: '1',
          // 	name: '语音面试'
          // },
          {
            id: "2",
            name: "视频面试",
          },
        ],
      ],
      columnstime: [
        ["09", "10", "11", "12", "13", "14", "15", "16", "17", "18"],
        ["00", "30"],
      ],
      addshow: false,
      Address: [],
    };
  },
  created() {
    this.listdata();
  },
  // 计算属性
  computed: {
    defaultIndex() {
      let ledtt = [0, 0];

      this.columnstime[0].forEach((res, index) => {
        if (this.timetext) {
          if (this.timetext.split(":")[0] == res) {
            ledtt[0] = index;
          }
        }
      });
      this.columnstime[1].forEach((res, index) => {
        if (this.timetext) {
          if (this.timetext.split(":")[1] == res) {
            ledtt[1] = index;
          }
        }
      });

      return ledtt;
    },
    addcolumns() {
      return [this.Address];
    },
    datatext: {
      get() {
        if (this.objlist.InterviewTime) {
          return this.objlist.InterviewTime.split(" ")[0];
        }
      },
      set(val) {},
    },
    timetext: {
      get() {
        if (this.objlist.InterviewTime) {
          let timet = this.objlist.InterviewTime.split(" ")[1].split(":");
          if (timet) {
            return `${timet[0]}:${timet[1]}`;
          } else {
            return "";
          }
        }
      },
      set(val) {},
    },
  },
  methods: {
    listdata() {
      let qyid = uni.getStorageSync("dianjiqiye");
      this.$http.core.tenantgetall(qyid.Id).then((res) => {
        if (res.Success) {
          console.log(res.Result.Address);
          this.Address = res.Result.Address;
        }
      });
    },
    addxuanzhe() {
      if (this.Address.length > 0) {
        this.addshow = true;

        this.datetimeshow = false;
        this.show = false;
        this.timmeteshow = false;
      }
    },

    timesmetshow() {
      this.timmeteshow = true;

      this.addshow = false;
      this.datetimeshow = false;
      this.show = false;
    },
    datashow() {
      this.datetimeshow = true;

      this.timmeteshow = false;
      this.addshow = false;
      this.show = false;
    },

    confirmtimme(e) {
      let timees = `${e.value[0]}:${e.value[1]}:00`;
      let datadat = this.datatext;
      if (!datadat) {
        datadat = new Date().toISOString().slice(0, 10);
      }

      this.objlist.InterviewTime = datadat + " " + timees;
      this.timmeteshow = false;
    },

    xxAddress() {
      this.datetimeshow = false;
      this.show = false;
      this.timmeteshow = false;
      this.addshow = false;

      let _that = this;

      console.log(this.Latitude);
      console.log(this.Longitude);

      uni.chooseLocation({
        latitude: Number(_that.Latitude),
        longitude: Number(_that.Longitude),
        success: function (res) {
          _that.objlist.Address = res.address;
          _that.objlist.Latitude = res.latitude;
          _that.objlist.Longitude = res.Longitude;

          _that.geocoderegeo(res);
        },
        fail: function (e) {},
      });
    },

    //根据经纬度 获取信息
    geocoderegeo(res) {
      let _that = this;
      let location = res.longitude + "," + res.latitude;
      this.$util.geocoderegeo(location).then((res1) => {
        //详细地址信息
        console.log(
          "定位地址详细地址信息",
          res1.data.regeocode.addressComponent
        );

        let adcode = res1.data.regeocode.addressComponent.adcode;
        area.forEach((item, index) => {
          item.children?.forEach((item1, index) => {
            item1.children?.forEach((item2, index) => {
              if (adcode == item2.value) {
                _that.objlist.ProvinceCode = item.value;
                _that.objlist.CityCode = item1.value;
                _that.objlist.AreaCode = item2.value;
              }
            });
          });
        });
      });
    },
    addconfirm(e) {
      this.addshow = false;
      this.objlist.Address = e.value[0].Address;
      this.objlist.ProvinceCode = e.value[0].ProvinceCode; //省
      this.objlist.CityCode = e.value[0].CityCode; //市
      this.objlist.AreaCode = e.value[0].AreaCode; ///区
      this.objlist.Latitude = e.value[0].Latitude; //
      this.objlist.Longitude = e.value[0].Longitude; //
    },
    datetimeconfirm(e) {
      const timeFormat = uni.$u.timeFormat;
      let ds = timeFormat(e.value, "yyyy-mm-dd");
      let adstime = this.timetext;
      if (!adstime) {
        adstime = "09:00";
      }
      this.objlist.InterviewTime = ds + " " + adstime;
      this.datetimeshow = false;
    },
    confirmzt(e) {
      this.objlist.InterviewType = e.value[0].id;
      this.show = false;
    },
    // 关闭
    close() {
      this.datetimeshow = false;
      this.show = false;
      this.timmeteshow = false;
      this.addshow = false;
    },
    columnstext(items) {
      let arr = [];
      if (this.columns.length > 0) {
        arr = this.columns[0].filter((res) => {
          return items == res.id;
        });
      }
      if (arr.length == 0) {
        return "";
      } else {
        return arr[0].name || " ";
      }
    },
    clickbut() {
      if (!this.objlist.InterviewTime) {
        uni.$u.toast("请选择面试日期");
        return;
      }

      if (!this.objlist.Address && this.objlist.InterviewType == 0) {
        uni.$u.toast("请输入详细地址");
        return;
      }
      if (!this.objlist.LinkManName) {
        uni.$u.toast("请输入姓名");
        return;
      }
      if (this.objlist.LinkManName) {
        const realnameReg = /^[\u4E00-\u9FA5]{2,4}$/;
        if (!realnameReg.test(this.objlist.LinkManName)) {
          uni.$u.toast("请输入2-4个汉字");
          return;
        }
      }
      if (!this.objlist.LinkManPhone) {
        uni.$u.toast("请输入联系人手机号");
        return;
      }
      if (this.objlist.LinkManPhone) {
        var phonereg = 11 && /^((13|14|15|16|17|18|19)[0-9]{1}\d{8})$/;
        if (!phonereg.test(this.objlist.LinkManPhone)) {
          uni.$u.toast("请输入正确手机号");
          return;
        }
      }
      this.$emit("clickbut", this.objlist);
    },
    closeupopupshowmiashi() {
      this.$emit("clickbut");
    },
  },
  watch: {
    "objlist.InterviewType": {
      handler(val) {
        if (val != 0) {
          this.objlist.Address = "";
        }
      },
    },
  },
};
</script>

<style lang="scss" scoped>
.upopupshowmiashicss {
  padding: 20rpx 20rpx;
  width: 600rpx;

  .upopupshcsstop {
    padding: 20rpx 10rpx;
    text-align: center;
  }

  .upopupshowmiashicsstextnr {
    display: flex;
    justify-content: start;
    align-items: center;
    margin: 10rpx 10rpx;
    padding: 10rpx 10rpx;
    box-sizing: border-box;

    .nrtextop {
      width: 35%;
    }

    .nrtexnr {
      width: 65%;
    }

    .addcss {
      display: flex;
      font-size: 26rpx;
      border: 1rpx solid rgb(192, 196, 204);
      border-radius: 10rpx;
    }

    .inputext {
      border: 1px solid red;
      // padding: 10rpx 0rpx;
      box-sizing: border-box;
    }

    /deep/.u-border {
      padding: 0rpx 20rpx !important;
      background-color: #ffffff !important;
    }
  }

  .ofbutbutton {
    text-align: center;
    padding: 20rpx 30rpx;
  }

  .upopupnrbut2 {
    display: inline-block;
    padding: 20rpx 60rpx;
    border-radius: 10rpx;
    font-size: 26rpx;
    background-color: #1684fc;
    color: #ffffff;
  }
}
</style>